<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>请先登录！</title>
    <!-- 主页内嵌的加密文件 -->

    <!--图标样式-->
    <link rel="stylesheet" href="图标文件/font-awesome.min.css">

    <!-- 日期方面的css设置 -->
    <link rel="stylesheet" href="NoBackGroundMain链接文件/日期方面的css设置.css">

    <!-- 其它css设置 -->
    <link rel="stylesheet" href="NoBackGroundMain链接文件/其它css设置.css">

    <!-- 弹出框登录界面样式 -->
    <link rel="stylesheet" href="NoBackGroundMain链接文件/弹出框/弹出框登录界面样式.css">

    <!-- 弹出框框架生成 -->
    <link rel="stylesheet" href="NoBackGroundMain链接文件/弹出框/弹出框框架生成.css">

    <!-- 页面超链接内容的样式 -->
    <link rel="stylesheet" href="NoBackGroundMain链接文件/页面超链接内容的样式.css">

</head>

<body>
    <!-- 头部区域 -->
    <header>
        <div class="boxdate">
            <div class="firstDiv"></div>
            <div class="lastDiv"></div>
        </div>
        <input id="login_button" class="theme_button" type="button" value="登录" onclick="DirectLogin()">
        <h1>
            <span>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp</span>MY DUSTBIN
        </h1>

    </header>
    <!-- 主体区域 -->
    <div class="main">
        <aside class="left_box" id="left_box">
            <nav>
                <hr size="3" width="auto">
                <a href="#" onclick="confirmLogin()">
                    <h1>HTML5课堂文件</h1>
                </a>
                <hr size="3" width="auto">
                <a href="#" onclick="confirmLogin()">
                    <div class="fa fa-music"></div>
                    <h1 class="common">音乐</h1>
                </a>
                <hr size="3" width="auto">
                <a href="#" onclick="confirmLogin()">
                    <h1>有趣的网页</h1>
                </a>
                <hr size="3" width="auto">
                <a href="#" onclick="confirmLogin()">
                    <div class="fa fa-gamepad"></div>
                    <h1 class="common">小游戏</h1>
                </a>
                <hr size="3" width="auto">
            </nav>
        </aside>

        <!-- <aside class="right_box">
            <p>右侧边栏</p>
        </aside> -->

        <section class="middle_box" id="middle_box">
            <!-- HTML5一栏设定 -->
            <ul id="new1" class="container">
                <iframe id="my-iframe" class="my-iframe" src="front.html" frameborder="10px solid" scrolling="0"></iframe>
                <!-- 内部网页，scolling为轮滑条 -->
            </ul>
        </section>
    </div>

    <footer>
        @WYH
    </footer>

    <!-- 弹框登录 -->
    <div id="dialog" class="dialog">
        <div class="dialog-content">
            <!-- 弹框内容 -->
            <button class="close-button" onclick="closeDialog()">x</button>
            <div id="block1" class="block1">
                <h1>&nbsp;&nbsp;&nbsp;LOGIN</h1>
                <form action="#" method="post">
                    用户名：
                    <input class="right" type="text" id="username" placeholder="请输入您的用户名" maxlength="5">
                    <br><br>密码：
                    <input class="right" type="password" id="password" placeholder="请输入您的密码">
                    <div id="remenber_password" class="remenber_password"><input type="checkbox">记住密码</div>
                    <div class="register">
                        <a href="#" onclick="toggleBlocks()">快速注册</a> | 
                        <a href="HTML5课堂文件/第四章/登录/协议与政策.html" target="_blank">忘记密码？</a></div><br>
                    <div class="box">
                        <input type="reset" class="reset" value="清空">
                        <input class="login" type="button" value="登录" onclick="login()">
                    </div>
                    <div class="agreement">
                        <input type="checkbox" id="protocal_checkbox" checked> 阅读并接受
                        <a href="HTML5课堂文件/第四章/登录/协议与政策.html" target="_blank">登录协议</a> 和
                        <a href="HTML5课堂文件/第四章/登录/协议与政策.html" target="_blank">隐私政策</a>
                    </div>
                </form>
            </div>
            <div id="block2" class="block2" style="display: none;">
                <h1>&nbsp;&nbsp;&nbsp;REGISTER</h1>
                <form action="#" method="post" id="link_login">
                    用户名：
                    <input class="right" type="text" id="register_username" placeholder="请输入您的用户名" maxlength="5">
                    <br><br>密码：
                    <input class="right" type="password" id="register_password" placeholder="请输入您的密码">
                    <br><br>确认密码：
                    <input class="right" type="password" id="confirm_password" placeholder="请再次输入您的密码">
                    <div class="register"><a href="#" onclick="toggleBlocks()">已有账号？快速登录</a></div><br>
                    <div class="box">
                        <input type="reset" class="reset" value="清空">
                        <input class="sign" type="button" value="注册" onclick="login()">
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!-- 时钟方面的代码 -->
    <script src="NoBackGroundMain链接文件/时钟方面的代码.js"></script>

    <!-- 弹出框显示与关闭 -->
    <script src="NoBackGroundMain链接文件/弹出框/弹出框显示与关闭.js"></script>

    <!-- 登录注册操作判断 -->
    <script src="NoBackGroundMain链接文件/弹出框/登录注册操作判断.js"></script>

    <!-- 注册信息存储 -->
    <script src="NoBackGroundMain链接文件/弹出框/localStorage.js"></script>

    <!-- 存储信息加密解密 -->
    <script src="NoBackGroundMain链接文件/弹出框/加密解密.js"></script>

    <!-- 注册登录页面切换 -->
    <script src="NoBackGroundMain链接文件/弹出框/注册登录页面切换.js"></script>

    <!-- 屏幕分辨率大小兼容控制JS -->
    <script src="NoBackGroundMain链接文件/屏幕分辨率大小兼容控制.js"></script>

</body>

</html>